/*
* @Author: jingyu.ma
* @Date:   2017-07-12 20:59:25
* @Last Modified by:   jingyu.ma
* @Last Modified time: 2017-08-07 20:13:52
*/

import React, { Component }from 'react';
import { connect } from 'react-redux';
import MyPublishSkill   from 'components/myPublishSkill.jsx';
import MyPublishDemand  from 'components/myPublishDemand.jsx';
import { getMyDemand, getMySkill,cacalOrderById ,changePublishrDetailId} from 'action/myPublishs.js';
import { editOrderToCommont } from 'action/commont.js';
import 'css/components/tabs.less';
class MyPublishLists extends Component {
    constructor(props) {
        super(props);
        this.getMyDemand();
        this.state = {
           active: 'myDemand' 
        }
    }  
    getMyDemand(page){
        let data = {
            pageNumber: page || this.props.myPublish.publishPlist.pageNo,
            pageSize:10
        }
        this.props.getDemand(data);
    }
    getMySkill(page){
        let data = {
            pageNumber: page || this.props.myPublish.publishPlist.pageNo,
            pageSize:10
        }
        this.props.getMySkill(data);
    }
    hasMoreList(){
        if(this.state.active == 'myDemand'){
            this.getMyDemand(this.props.myPublish.publishPlist.pageNo+1);
        }else{
            this.getMySkill(this.props.myPublish.publishPlist.pageNo+1);
        }
        
    }
    changeActive(status,tabName){
        let active = status == 1?'myDemand':'mySkill';
        this.setState(Object.assign({},this.state,{
            active: active
        }))
       if(status == 1){
            this.getMyDemand()
       }else{
            this.getMySkill();
       }
    }
    goToDetail(id){
        this.props.goToDetailPage(id);
        window.location.href = '#/orderDetail';
    }
    cacalOrder(id){
        let data = {
            status:this.state.active = 'myDemand'?1:2,
            id:id
        }
        this.props.cacalOrder(data);
    }

    goCommont(id){
        this.props.goCommont(id);
        window.location.href = '#/evaluate';
    }
    render(){
        let list = this.state.active == 'myDemand'?<MyPublishDemand publishList = {this.props.myPublish.myDemand} goToDetail={(id) => {this.goToDetail(id)}} cacalOrder={(id) => {this.props.cacalOrder(id)}} goCommont={(id) => {this.goCommont(id)}} hasMoreList={()=>{this.hasMoreList()}}/>:<MyPublishSkill publishList = {this.props.myPublish.mySkill} goToDetail={(id) => {this.goToDetail(id)}} cacalOrder={(id) => {this.props.cacalOrder(id)}} goCommont={(id) => {this.goCommont(id)}} hasMoreList={()=>{this.hasMoreList()}}/>
        return (
            <div className="content">
                <ul className="subNavWrap">
                    <li key='myDemand' onClick={()=>{this.changeActive(1,'myDemand')}} className={this.state.active == 'myDemand'?'active':''}>我的需求</li>
                    <li key='mySkill' onClick={()=>{this.changeActive(2,'mySkill')}} className={this.state.active == 'mySkill'?'active':''}>我的技能</li>
                </ul>
               {list}
            </div>
        );
    }
}

const MyPublishData = (state) => {
    console.log(state);
    return {
        myPublish: state.myPublish,
        user: state.user
    }
}
let dispatchHandle = (dispatch, getState) => {
    return {
        getDemand(data){
            dispatch(getMyDemand(data));
        },
        getMySkill(data){
            dispatch(getMySkill(data));
        },
        goToDetailPage(id){
            let data = {
                id: id
            }
            dispatch(changePublishrDetailId(data));
        },
        cacalOrder(data){
            dispatch(cacalOrderById(data));
        }
    }    
}
let visibileMyOrder= connect(MyPublishData, dispatchHandle)(MyPublishLists);


export default visibileMyOrder;